
let url = window.location.href
let urlArr = url.split("?")

let urlQuery = urlArr[1]
console.log(urlQuery)


// couponId: 0
// couponProductId: 0
// couponProductImg: "<img src=\"http://d3.5ikfc.com/static/thumbs/1016/kfc-5ikfc-108_pc27.jpg\" alt=\" 两人小食组 新奥尔良烤翅2块+薯条(中)+黄金鸡块5块+劲爆鸡米花(小) 2016年10月凭肯德基优惠券\">"
// couponProductName: "C27  两人小食组 新奥尔良烤翅2块+薯条(中)+黄金鸡块5块+劲爆鸡米花(小) 2016年10月凭肯德基优惠券"
// couponProductPrice: "￥ 28"
// couponProductTime: "有效期至10月31日"
// _id: "580b6b4861457b22d6b8e6d8"

fetch("http://chst.vip:1234/api/getcouponproduct?" + urlQuery)
    .then(body => body.json())
    .then(res => {
        //console.log(res)
        let html = ""
        let carhtml = ""
        res.result.forEach(item => {
            html += `
            <li data-index = ${item.couponProductId}>
                <a href= "javascript:">
                    <div class="img f1">${item.couponProductImg}</div>
                    <div class="infoR">
                        <div class="title">
                            <h4>${item.couponProductName}</h4>
                        </div>
                        <div class="other">
                            <h4>${item.couponProductPrice}</h4>
                            <div class="mall">${item.couponProductTime}</div>
                        </div>
                    </div>
                </a>
            </li>
            `
            carhtml+=`
            <li>
                ${item.couponProductImg}
            </li>
            `
        })
        let info = document.querySelector(".info")
        info.innerHTML = html


        let infos = document.querySelectorAll(".info>li")
        let carousel = document.querySelector(".carousel")
        let carinfo = document.querySelector(".carinfo")
        carinfo.innerHTML = carhtml

        let is =document.querySelectorAll(".maskSm>i")

        let arrLeft = document.querySelector(".arrLeft")
        let arrRight = document.querySelector(".arrRight")
        
        //设置carinfo ul宽度
        carinfo.style.width = infos.length*5.333333 + "rem"

        Array.from(infos).forEach(li => {
            li.onclick = function () {
                carousel.style.transform = "translateY(0)"
                let dataIndex = li.getAttribute("data-index")
                // console.log(dataIndex)
                let X = -dataIndex*5.333333
                carinfo.style.transform = "translateX("+X+"rem)"

                arrLeft.onclick=function(){
                    if(dataIndex>=infos.length-1){
                        alert("已经是最后一页了")
                        return
                    }
                    dataIndex++
                    let X = -dataIndex*5.333333
                    carinfo.style.transform = "translateX("+X+"rem)"
                }
                arrRight.onclick=function(){
                    if(dataIndex<=0){
                        alert("已经是第一页了")
                        return
                    }
                    dataIndex--
                    let X = -dataIndex*5.333333
                    carinfo.style.transform = "translateX("+X+"rem)"
                }
            }
        })
        Array.from(is).forEach(i=>{
            i.onclick = function(){
                carousel.style.transform = "translateY(1000px)"
            }
        })
        
    })

